<app-back-btn></app-back-btn>
<div class="page-title">
  <span class="title">用户详情</span>
</div>

<!--Extra0006:[--]-->
<!--用户信息-->
<div class="panel panel-body">
  <!--用户信息-->
  <section class="mb-20">
    <h3 class="subtitle">用户详细信息</h3>
    <div nz-row class="p-15">

      <div nz-col nzSm="12" nzXXl="10" [nzXs]="24">
        <p>
          <strong class="pr"> 账户：</strong><!--账户-->
          <span>{{userInfo?.account || '--'}}</span>
        </p>

        <div>
          <strong class="fl">用户类型：</strong><!--用户类型-->
          <p class="item-data mb0">
          <span
            [ngClass]="{'color-orange':userInfo?.leader===userTypes.leader,
            'color-green':userInfo?.leader===userTypes.areaManager}">{{userInfo?.leader | enumName: userType}}</span>
            <ng-container *ngIf="userInfo?.leader!==userTypes.leader">
              <button nz-popconfirm nzTitle="您要将该用户设为领导人吗？" [nzSize]="'small'"
                      nzPlacement="topLeft" nz-button class="btn-warning-o ml mb"
                      [disabled]="userInfo?.state !== userStates.active"
                      (nzOnConfirm)="updateToLeader(userTypes.leader)">
                <i class="anticon anticon-user"></i>设为领导人
              </button>
            </ng-container>
            <ng-container *ngIf="userInfo?.leader!==userTypes.member">
              <button nz-popconfirm nzTitle="您要将该用户设为普通会员吗？" [nzSize]="'small'"
                      nzPlacement="topLeft" nz-button class="btn-blue-o ml mb"
                      [disabled]="userInfo?.state !== userStates.active"
                      (nzOnConfirm)="updateToLeader(userTypes.member)">
                <i class="anticon anticon-meh"></i>设为普通会员
              </button>
            </ng-container>
            <ng-container *ngIf="userInfo?.leader!==userTypes.areaManager">
              <button nz-popconfirm nzTitle="您要将该用户设为区域管理员吗？" [nzSize]="'small'"
                      nzPlacement="topLeft" nz-button class="btn-green-o ml mb"
                      [disabled]="userInfo?.state !== userStates.active"
                      (nzOnConfirm)="updateToLeader(userTypes.areaManager)">
                <i class="anticon anticon-smile"></i>设为分公司管理员
              </button>
            </ng-container>
          </p>
        </div>

        <div class="mb">
          <strong class="fl">账户状态:</strong><!--状态:激活 Active，冻结 Frozen，删除 Delete-->
          <p class="mb0 item-data">
            <nz-badge nzStatus="success" *ngIf="userInfo?.state === userStates.active"></nz-badge>
            <nz-badge nzStatus="default" *ngIf="userInfo?.state === userStates.delete"></nz-badge>
            <nz-badge nzStatus="error" *ngIf="userInfo?.state === userStates.frozen"></nz-badge>
            {{userInfo?.state | enumName:state}}
          </p>
        </div>

        <p>
          <strong class="pr"> 星级：</strong><!--星级-->
          <nz-rate [ngModel]="userInfo?.star" title="星级" nzDisabled [nzCount]="7"></nz-rate>
          <span class="ml-5">{{userInfo?.star}}级</span>
        </p>
        <p>
          <strong class="pr"> 真实姓名：</strong><!--真实姓名-->
          <span>{{userInfo?.realName || '--'}}</span>
        </p>

        <p>
          <strong class="pr">身份证号：</strong><!--身份证号-->
          <span>{{userInfo?.idCard || '--'}}</span>
        </p>

        <p>
          <strong class="pr">子账户：</strong><!--子账户-->
          <nz-badge [nzCount]="userInfo?.subAccountNum || 0" [nzStyle]="{ backgroundColor: '#ff9800' }">
            <button *ngIf="userInfo?.subAccountNum && userInfo?.subAccountNum>0" nz-button [nzSize]="'small'"
                    (click)="userSubAccount(userInfo?.realName,userInfo?.code)" class="btn-blue-o">查看
            </button>
          </nz-badge>
          <span *ngIf="!userInfo?.subAccountNum" class="color-gray">无</span>
        </p>

        <div class="mb">
          <strong class="fl">账户余额：</strong><!--账户余额-->
          <p class="mb-5 item-data">金兰宝：<span
            class="color-red">{{(userInfo?.userJlb?.jlb || 0) | number:'1.2-2'}}</span></p>
          <p class="mb-5 item-data">商城金兰宝：<span class="color-red">{{(userInfo?.userJlb?.mallTotalJlb || 0) | number:'1.2-2'}}</span>
          </p>
          <p class="mb-5 item-data">激活币：<span class="color-red">{{userInfo?.userActive?.active || 0}}</span></p>
          <p class="mb-5 item-data">矿石：<span class="color-red">{{(userInfo?.userOre?.ore || 0) | number:'1.2-2'}}</span>
          </p>
          <p class="mb-5 item-data">待提炼矿石：<span class="color-red">{{(userInfo?.userOre?.refineTotalOre || 0) | number:'1.2-2'}}</span>
          </p>
        </div>

        <div class="mb">
          <strong class="fl">矿机：</strong><!--矿机-->
          <ng-container *ngIf="userInfo?.userMiner">
            <p class="item-data mb-5">功率：{{userInfo?.userMiner?.power}}</p>
            <p class="item-data mb-5">状态：
              <nz-badge nzStatus="processing" *ngIf="userInfo?.userMiner?.state === userMinerStates.working"></nz-badge>
              <nz-badge nzStatus="error" *ngIf="userInfo?.userMiner?.state === userMinerStates.stop"></nz-badge>
              {{userInfo?.userMiner?.state | enumName: userMinerState}}
            </p>
          </ng-container>
          <ng-container *ngIf="!userInfo?.userMiner">
            <span class="color-gray">无</span>
          </ng-container>
        </div>

      </div>

      <div nz-col nzSm="12" nzXXl="10" [nzXs]="24">
        <p>
          <strong class="pr"> 昵称：</strong><!--昵称-->
          <span>{{userInfo?.nickName || '--'}}</span>
        </p>
        <p>
          <strong class="pr">国籍：</strong><!--国籍-->
          <span>{{userInfo?.country || '--'}}</span>
        </p>

        <p>
          <strong class="pr">区域：</strong><!--区域编码-->
          <span>{{(userInfo?.areaCode | areaName) || '--'}}</span>
        </p>
        <p>
          <strong class="pr">支付宝账户：</strong><!--支付宝账户-->
          <span>{{userInfo?.alipay || '--'}}</span>
        </p>

        <p>
          <strong class="pr">微信账户：</strong><!--微信账户-->
          <span>{{userInfo?.wechat || '--'}}</span>
        </p>

        <div class="mb">
          <strong class="fl">银行账户：</strong><!--微信账户-->
          <p class="item-data" *ngFor="let item of userInfo?.userBankCardList">
            开户行：{{item.bankName}}—{{item.subBank}}<br>
            开户人：{{item.bankMan}}<br>
            账号：{{item.bankNumber}}
          </p>
          <span class="color-gray" *ngIf="userInfo?.userBankCardList?.length === 0">无</span>
        </div>

        <p>
          <strong class="pr">创建时间：</strong><!--创建时间-->
          <span>{{userInfo?.createTime | date: 'yyyy-MM-dd HH:mm:ss'}}</span>
        </p>

        <p>
          <strong class="pr">更新时间：</strong><!--更新时间-->
          <span>{{userInfo?.updateTime | date: 'yyyy-MM-dd HH:mm:ss'}}</span>
        </p>

      </div>
    </div>
  </section>
</div>


